import { Button, Divider, message, Popconfirm } from 'antd'
import { PlusOutlined } from '@ant-design/icons'
import React, { useState, useRef, useEffect } from 'react'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import ProTable, { ProColumns, ActionType } from '@ant-design/pro-table'
import { connect, Link } from 'umi'
import { getSalaryChangePage, saveAndUpdateSalaryChange, deleteSalaryChange } from '../../service'
import { salaryChangeBpm } from '../service'
import CreateForm from './components/CreateForm'
import moment from 'moment'
import {salaryAdjustmentTypeList} from "@/utils/constant";

const TableList = ({global}) => {
  const { options = {} } = global;
  const { orgLine = [], orgSystem = [], jobLevel = [] } = options;
  const actionRef = useRef();
  const [visible, setVisible] = useState(null);
  const [current, setCurrent] = useState(undefined);

  const itemEdit = (item) => {
    salaryChangeBpm(item.id).then(res => {
      if (res.flag){
        window.open(res.data)
      }else {
        message.error(res.error)
      }
    })
  };

  const handleModalVisible = (value) => {
    setVisible(value)
  };

  const columns = [
    {
      title: '工号',
      dataIndex: 'code',
      hideInSearch: true,
    },
    {
      title: '姓名',
      dataIndex: 'name',
      width:60,
      render: (item, record) => (
        <Link to={`/info/details/${record.oid}`}>{item}</Link>
      ),
    },
    {
      title: '生效日期',
      dataIndex: 'effectiveTime',
      hideInSearch: true,
      render: (text) => {
        return text!=='-' ? moment(text).format('YYYY-MM-DD') : ''
      }
    },
    {
      title: '变动类型',
      dataIndex: 'type',
      hideInSearch: true,
      valueEnum: {
        0: { text: salaryAdjustmentTypeList[0].label},
        1: { text: salaryAdjustmentTypeList[1].label},
        2: { text: salaryAdjustmentTypeList[2].label},
        3: { text: salaryAdjustmentTypeList[3].label},
        4: { text: salaryAdjustmentTypeList[4].label},
        5: { text: salaryAdjustmentTypeList[5].label},
        6: { text: salaryAdjustmentTypeList[6].label},
        7: { text: salaryAdjustmentTypeList[7].label},
      },
    },
    {
      title: '公司',
      dataIndex: 'newOrgName',
      hideInSearch: true,
      render: (text,record) =>(text !== '-' ? text : record.orgname)
    },
    {
      title: '所属部门',
      dataIndex: 'newUnitName',
      hideInSearch: true,
      render: (text,record) =>(text !== '-' ? text : record.unitname)
    },
    {
      title: '任职岗位',
      dataIndex: 'newJobName',
      hideInSearch: true,
      render: (text,record) =>(text !== '-' ? text : record.jobname)
    },
    {
      title: '职级',
      dataIndex: 'newJobLevelId',
      hideInSearch: true,
      render: (text,record) => {
        return text !== '-' ?
          jobLevel.find(item => text ===item.id)?.name :
          jobLevel.find(item => record.jobLevelId ===item.id)?.name
      }
    },
    {
      title: '现月薪标准',
      dataIndex: 'standardMonthlySalary',
      hideInSearch: true,
    },
    {
      title: '现基本工资基数',
      dataIndex: 'baseSalary',
      hideInSearch: true,
    },
    {
      title: '现模块工资基数',
      dataIndex: 'moduleSalaryBase',
      hideInSearch: true,
    },
    {
      title: '操作',
      dataIndex: 'option',
      valueType: 'option',
      hideInSearch: true,
      render: (item, record) => (
        <>
          <a onClick={() => itemEdit(record)}>发起</a>
          {record.type === 5 && <>
            <Divider type="vertical"/>
            <Popconfirm title='是否确认删除?' onConfirm={() => deleteAdjustment(record.id)} okText="是" cancelText="否">
              <a>删除</a>
            </Popconfirm></>}
        </>
      ),
    },
  ];

  const handleCancel = () => {
    setVisible(false)
  };

  const deleteAdjustment = (id) => {
    deleteSalaryChange(id).then(res => {
      if (res.flag){
        message.success('薪资调整删除成功！')
      }else {
        message.error(res.error);
      }
      actionRef.current.reload();
    })
  };

  const handleSubmit = (values) => {
    setVisible(false);
    saveAndUpdateSalaryChange(values).then(res => {
      if (res.flag){
        message.success('保存薪资变动成功!');
      }else {
        message.error(res.error)
      }
      actionRef.current.reload();
    });
  };

  return (
    <PageHeaderWrapper>
      <ProTable
        actionRef={actionRef}
        rowKey="id"
        request={(params) => getSalaryChangePage(params,null,0)}
        columns={columns}
        toolBarRender={(action, { selectedRows }) => [
          <Button type="primary" onClick={() => handleModalVisible(true)}>
            <PlusOutlined/> 新建
          </Button>,
        ]}
      />
      <CreateForm
        current={current}
        visible={visible}
        onCancel={handleCancel}
        onSubmit={handleSubmit}
      />
    </PageHeaderWrapper>
  )
};

export default connect(({ global }) => ({
  global
}))(TableList)
